<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title> jsGraph sample 1</title>
 </head>
 <body>
 <div id="canvas" style="width:800px;height:800px;border:1px solid #aaa;background-color:#ccc"></div>
  <script type="text/javascript" src="jsGraph.js"></script>
  <script type="text/javascript">
	var canvas = createJsGraph(document.getElementById('canvas'),800,800);
	var c1=canvas.circle([200,80],50).stroke('yellow',2).fill('red')
	.onclick(function (e,o){
		o.rotate(45,[200,200]);
	});
	var c2=canvas.circle([200,200],50).stroke('yellow',2).fill('white')
	.onclick(function (e,o){
		c1.hide();
		setTimeout('c1.show()',1000);
	});
	var o = [550,200];
	with(canvas){
		sector(o,120,0,90).fill('purple').stroke('black',1);
		sector(o,120,90,30).fill('red').stroke('black',1);
		sector(o,120,120,45).fill('blue').stroke('black',1);
		sector(o,120,165,60).fill('green').stroke('black',1);
		sector(o,120,225,15).fill('yellow').stroke('black',1);
		sector(o,120,240,120).fill('#0ff').stroke('black',1);
	}
  </script>
 </body>
</html>
